<!DOCTYPE html>
<html lang="en">
<head>
    <script src="/static/js/dev.js"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <!--bootstrap插件-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="/static/plugin/bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="/static/plugin/jo/joUI.css" rel="stylesheet"/>
    <!--字体插件-->
    <link href="/static/plugin/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/static/plugin/layui-2.4.3/css/layui.css" rel="stylesheet"/>
    <!--ztree-->
    <link href="/static/plugin/zTree/css/metroStyle/metroStyle.css" rel="stylesheet"/>
    <!--common-->
    <link href="/static/css/common.css" rel="stylesheet"/>
    <!--帮助手册样式-->
    <link rel="stylesheet" type="text/css" href="/static/css/help/document.css"/>
    <!--代码高亮-->
    <link type="text/css" rel="stylesheet" href="/static/plugin/SyntaxHighlighter/styles/shCore.css"/>
    <link type="text/css" rel="stylesheet" href="/static/plugin/SyntaxHighlighter/styles/shCoreDefault.css"/>
    <link type="text/css" rel="stylesheet" href="/static/plugin/SyntaxHighlighter/styles/shThemeDefault.css"/>
    <title>常用代码块示范</title>
    <style>
        .code-title {
            display: inline-block;
            padding-top: 5px;
            line-height: 25px;
            color: blue;
            size: 18px;
            font-weight: 600;
        }
    </style>
    <script>

    </script>
</head>

<body style="padding:5px 10px; box-sizing:border-box; background-color:white;">
<a href="#" target="_blank" class="showAtTop">显示单页</a>
<table class="docTable">
    <tr class="docTitle">
        <td colspan="2">
            <i class="fa fa-caret-down"> </i>&nbsp;&nbsp;&nbsp;&nbsp;Code 常用代码块
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <p>一些常用的代码, 需要的时候来这里找一下</p>
        </td>
    </tr>
</table>

<table class="docTable">
    <tr class="docTitle">
        <td colspan="2"><i class="fa fa-caret-down"> </i>属性</td>
    </tr>

    <tr>
        <td>
            <attr>
                <obj/>
                xx
            </attr>
        </td>
        <td>xxx</td>
    </tr>
</table>

<table class="docTable">
    <tr class="docTitle">
        <td colspan="2">
            <i class="fa fa-caret-down"> </i>方法
        </td>
    </tr>
    <tr>
        <td>
            <func>
                <boolean/>
                xxx
            </func>
        </td>
        <td>xxx</td>
    </tr>

</table>
<!--demo-->
<div class="eg">

    <span class="code-title">下拉按钮：</span>
    <div class="btn-group" style="z-index: 1000;">
        <button type="button" class="btn btn-sm btn-success" onclick=""><i class="fa fa-file-text-o"
                                                                           aria-hidden="true"></i>&nbsp;详情
        </button>
        <button type="button" class="btn btn-sm btn-success dropdown-toggle" data-toggle="dropdown"><span
                class="caret"></span> <span class="sr-only"></span></button>
        <ul class="dropdown-menu" role="menu" style="min-width: 5em;">
            <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart" aria-hidden="true"></i>&nbsp;链路图</a></li>
            <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart" aria-hidden="true"></i>&nbsp;接口监控</a></li>
        </ul>
    </div>
    <div class="btn-group" style="z-index: 1000;">
        <button type="button" class="btn btn-sm btn-success dropdown-toggle" data-toggle="dropdown"><i
                class="fa fa-file-text-o" aria-hidden="true"></i>&nbsp;详情 <span class="caret"></span></button>
        <ul class="dropdown-menu" role="menu" style="min-width: 5em;z-index: 2000;">
            <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart" aria-hidden="true"></i>&nbsp;链路图</a></li>
            <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart" aria-hidden="true"></i>&nbsp;接口监控</a></li>
        </ul>
    </div>
    <pre name="code" class="brush:html;toolbar:false;">

        <div class="btn-group" style="z-index: 1000;">
            <button type="button" class="btn btn-sm btn-success" onclick=""><i class="fa fa-file-text-o"
                                                                               aria-hidden="true"></i>&nbsp;详情</button>
            <button type="button" class="btn btn-sm btn-success dropdown-toggle" data-toggle="dropdown"> <span
                    class="caret"></span> <span class="sr-only"></span></button>
            <ul class="dropdown-menu" role="menu" style="min-width: 5em;">
                <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart"
                                                         aria-hidden="true"></i>&nbsp;链路图</a></li>
                <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart"
                                                         aria-hidden="true"></i>&nbsp;接口监控</a></li>
            </ul>
        </div>
        <div class="btn-group" style="z-index: 1000;">
            <button type="button" class="btn btn-sm btn-success dropdown-toggle" data-toggle="dropdown"> <i
                    class="fa fa-file-text-o" aria-hidden="true"></i>&nbsp;详情 <span class="caret"></span></button>
            <ul class="dropdown-menu" role="menu" style="min-width: 5em;">
                <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart"
                                                         aria-hidden="true"></i>&nbsp;链路图</a></li>
                <li><a class="cursor-hand" onclick=""><i class="fa fa-bar-chart"
                                                         aria-hidden="true"></i>&nbsp;接口监控</a></li>
            </ul>
        </div>

        <!--如果是在表格展示下拉按钮, 需要让每行的下拉按钮的z-index递减, 同时需要给表格容器设置visible属性, 同时添加下面的样式, 可以参考链路追踪页面trace.html-->
		<div class="table-responsive" style="overflow: visible;"></div>
		<style>
			body .table > tbody > tr > td:last-child {
                overflow: visible;
            }
		</style></pre>

    <span class="code-title">弹出代码高亮显示的弹窗</span>
    <pre name="code" class="brush:js;toolbar:false;">
		var idx = jo.showWin('/page/cms/codeEdit/javaCodeShow.html',"900px","500px","预览代码");
		var preWin = jo.getLayerIframe(idx);
		jo.iframeLoaded(preWin, function(){
			preWin.setContent(json);
		});</pre>

</div>

</body>

<!--配置信息-->
<script src="/static/js/config.js"></script>
<!--jquery-->
<script src="/static/plugin/jquery/jquery-3.3.1.js"></script>
<script src="/static/plugin/jquery/jquery.cookie.js"></script>
<!--bootstrap-->
<script src="/static/plugin/bootstrap/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!--[if lt IE 9]>
<script src="/static/plugin/other/html5shiv.js"></script>
<script src="/static/plugin/other/respond.min.js"></script>
<![endif]-->
<!--layui-->
<script src="/static/plugin/layui-2.4.3/layui.all.js"></script>
<!--ztree-->
<script src="/static/plugin/zTree/js/jquery.ztree.all.js"></script>
<!--common-->
<script src="/static/js/common.js"></script>
<!--jo-->
<script src="/static/plugin/jo/jo.js"></script>
<script src="/static/plugin/jo/jo-adapt.js"></script>
<script src="/static/plugin/jo/jo-page-view.js"></script>
<script src="/static/plugin/jo/jo-page-form.js"></script>
<script src="/static/plugin/jo/jo-listener.js"></script>
<!--帮助手册js-->
<script src="/static/js/help/document.js"></script>
<!--代码高亮-->
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shCore.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushCSharp.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushPhp.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushJScript.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushJava.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushVb.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushSql.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushXml.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushDelphi.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushPython.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushRuby.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushCss.js"></script>
<script class="javascript" src="/static/plugin/SyntaxHighlighter/scripts/shBrushCpp.js"></script>
<script class="javascript">
    highLight();
</script>
</html>
